<template>
  <div class="base-info">
    <div class="row">
      <b-cell label="技术职称" content="助理工程师" />
      <b-cell label="技术等级" content="中级" />
    </div>
    <div class="row">
      <b-cell label="办公电话" content="0857-7390058" />
      <b-cell label="健康状态" content="良好" />
    </div>
  </div>
</template>
<script setup lang="ts">
import BCell from '@/components/b-cell.vue'
</script>
<style scoped lang="scss">
.base-info {
  position: relative;
  .empty-box {
    position: relative;
    display: flex;
    
    flex: 1;
    min-width: 150px;
  }
  .row {
    position: relative;
    display: flex;
    gap: calc(16px * var(--scale));
    margin-top: calc(16px * var(--scale));
  }
  .img-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    text-align: center;
    .person-img {
      border-radius: 50%;
      height: calc(2.2em * 2 + calc(16px * var(--scale)));
    }
  }
}
</style>
